<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>轮播图</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="${s.base}/js/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="${s.base}/css/base/base.css?123456" media="all" /></head>

<body class="childrenBody">
<form class="layui-form">
	<input type="hidden" id="id" name="id" value="${hostBanner.id}" />

	<div class="layui-form-item layui-row layui-col-xs12" >
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;类型</label>
		<div class="layui-input-block">
			<select class="form-control" lay-filter="type" name="type" lay-verify="required" id="type"></select>
		</div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12" id="imageShow">
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;图片</label>
		<div class="layui-input-block">
			<!--单图片开始-->
			<div class="layui-input-block cy-uploadpic-ctn" id="image"  style=" float:left;margin:10px 0!important;position:relative; width: 90px; height: 90px;">
			</div>
			<!--单图片结束-->
		</div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12" id="videoShow">
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;视频</label>
		<div class="layui-input-block">
			<input type="text" class="layui-input" id="videoUrl" name="videoUrl" placeholder="请输入视频链接" autocomplete="off" /></div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12" >
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;范围</label>
		<div class="layui-input-block">
			<select class="form-control" name="scopeType" lay-verify="required" id="scopeType"></select>
		</div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12" >
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;城市选择</label>
		<div class="layui-input-block">
			<select class="form-control" name="cityId" lay-verify="required" id="cityId"></select>
		</div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12" >
		<label class="layui-form-label">
			<span class="red"></span>&nbsp;&nbsp;跳转类型</label>
		<div class="layui-input-block">
			<select class="form-control" name="jumpType" lay-verify="required" id="jumpType"></select>
		</div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12">
		<label class="layui-form-label">
			<span class="red">*</span>&nbsp;&nbsp;跳转链接</label>
		<div class="layui-input-block">
			<input type="text" class="layui-input" name="jumpUrl" value="${hostBanner.jumpUrl}" placeholder="请输入链接" autocomplete="off" /></div>
	</div>

	<div class="layui-form-item layui-row layui-col-xs12">
		<label class="layui-form-label">
			<span class="red">*</span>&nbsp;&nbsp;排序</label>
		<div class="layui-input-block">
			<input type="text" class="layui-input" name="orderNum" value="${hostBanner.orderNum}" placeholder="请输入排序" lay-verify="required" autocomplete="off" /></div>
	</div>
	<div class="layui-form-item layui-row layui-col-xs12">
		<div class="layui-input-block">
			<button class="layui-btn layui-btn-sm" lay-submit="" lay-filter="submitBtn">确定</button>
			<button type="reset" class="layui-btn layui-btn-sm layui-btn-primary cancel">取消</button></div>
	</div>
</form>
<script type="text/javascript" src="${s.base}/js/layui/layui.js"></script>
<script type="text/javascript" src="${s.base}/js/base/base.js"></script>
<script type="text/javascript" src="${s.base}/lib/KnifeZ/ace/ace.js"  charset="utf-8"></script>
<script type="text/javascript">layui.use(['form', 'jquery', 'baseUtil', 'pageUtil','fileUtil','richTxtUtil'],
    function() {
        var form = layui.form,
            $ = layui.jquery,
            richTxtUtil = layui.richTxtUtil,
            fileUtil = layui.fileUtil,
            baseUtil = layui.baseUtil,
            pageUtil = layui.pageUtil;

		var type = '${hostBanner.type}';
		if (type != null && type == "2") {
            $("#imageShow").hide();
            $("#videoShow").show();
            $("#videoUrl").val('${hostBanner.url}');
		} else {
            //单图片上传
            fileUtil.uploadImageNoSave('image',"host/banner","${hostBanner.url}");
            $("#imageShow").show();
            $("#videoShow").hide();
		}

        pageUtil.initDict("banner_type,app_jump_type,host_banner_scope_type",
            function(dictData) {
                pageUtil.showDict($("#type"), pageUtil.aceeptDictContentList(dictData, "banner_type"), "", '${hostBanner.type}');
                pageUtil.showDict($("#scopeType"), pageUtil.aceeptDictContentList(dictData, "host_banner_scope_type"), "", '${hostBanner.scopeType}');
                pageUtil.showDict($("#jumpType"), pageUtil.aceeptDictContentList(dictData, "app_jump_type"), "", '${hostBanner.jumpType}');
            });

        pageUtil.initDictByUrl("/hostCity/acceptSelect","host_city_type",
            function(dictData) {
                pageUtil.showDict($("#cityId"), pageUtil.aceeptDictContentList(dictData, "host_city_type"), "", '${hostBanner.cityId}');
            });

        // 监听事件
        form.on('select(type)', function(data){
            if(data.value == 2){
                $("#imageShow").hide();
                $("#videoShow").show();
                form.render('select');
            }else{
                $("#imageShow").show();
                $("#videoShow").hide();
                form.render('select');//select是固定写法 不是选择器
            }
        });

        form.on('submit(submitBtn)',
            function(data) {
            	var type = data.field.type;
            	if (type == "2") {
                    data.field.url = data.field.videoUrl;
				} else {
                    data.field.url = data.field.image;
				}
                baseUtil.postMethodResult("/hostBanner/addOrUpdate", data.field,
                    function(result) {
                        parent.location.reload();
                    });
                return false;
            });
    });</script>
</body>

</html>